<template>
  <div class="category">
    <h3>分类:{{ title }}</h3>
    <!-- 默认插槽:占位，等着组件使用者填充 -->
    <slot name="center"></slot>
    <slot name="footer"></slot>
  </div>
</template>

<script>
export default {
  props: ["title"],
};
</script>

<style>
.category {
  width: 200px;
  height: 300px;
  background-color: skyblue;
}
ul {
  list-style: none;
}
h3 {
  text-align: center;
  background-color: orange;
}
li {
  font-size: 16px;
}
</style>